<!DOCTYPE html>
	<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<title>User</title>
		<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../themes/icon.css">
		<script type="text/javascript" src="../jquery.min.js"></script>
		<script type="text/javascript" src="../jquery.easyui.min.js"></script>

		
	
		
	</head>
	<body>
	    <div class="easyui-layout" data-options="fit:true">
        <div data-options="region:'north'" style="height:30px">
        	<a href="#" id="loadAllDataBtn" class="easyui-linkbutton" data-options="iconCls:'icon-add'">切换分类</a>
        	<a href="#" id="addBtn" class="easyui-linkbutton" data-options="iconCls:'icon-add'">添加分类</a>
        	<a href="#" id="removesBtn" class="easyui-linkbutton" data-options="iconCls:'icon-remove'">删除分类</a>
        </div>
        <div data-options="region:'west',split:true" title="新闻分类" style="width:200px;">
        	<ul id="tt"></ul>
        </div>
        <div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
            <table id="dg"></table>

            <div id="dlg" class="easyui-dialog" title="Basic Dialog" data-options="iconCls:'icon-save',closed:true" style="width:400px;height:200px;padding:10px">
		        <form id="ff" method="post" name='txt'>
					<!--<div style="margin-bottom:10px">
						<input class="easyui-textbox" name="_id" style="width:100%" data-options="label:'分类Id:'">
					</div>-->
		            <div style="margin-bottom:30px">
		                <input class="easyui-textbox" name="title" style="width:100%" data-options="label:'分类名称:',required:true">
		                
		            </div>
		        </form>
		        <div style="text-align:center;padding:5px 0">
		            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()" style="width:80px">Submit</a>
		            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()" style="width:80px">Clear</a>
		        </div>
		    </div>
		    
        </div>
    </div>
    
    <script src="https://cdn.bootcss.com/jquery.serializeJSON/2.9.0/jquery.serializejson.js"></script>
    
		<script>

			/*切换分类*/
//  		$('#tt').tree({
//			    url: "http://localhost:3000/cate/list/1",
//			    method:'get',
//			    onClick: function(node){//点击标题分类显示新闻
//					cateId = node._id;
//					$("#dg").datagrid({
//						queryParams: {
//							cateId: cateId
//						}
//					}).datagrid('reload');
//				}
//			});
//			
//			var bstop = true;
//  		$("#loadAllDataBtn").click(function(){
//  			var cateId = 1;
//  			
//  			if(bstop){
// 					$('#tt').tree({
//				    url: "http://localhost:3000/cate/list/1",
//				    method:'get',
//				    onClick: function(node){//点击标题分类显示新闻
//						cateId = node._id;
//						$("#dg").datagrid({
//							queryParams: {
//								cateId: cateId
//							}
//						}).datagrid('reload');
//					}
//				    });
//				    bstop = false;
// 				}else{
// 					$('#tt').tree({
//				    url: "http://localhost:3000/cate/list/2",
//				    method:'get',
//				    onClick: function(node){//点击标题分类显示新闻
//						cateId = node._id;
//						$("#dg").datagrid({
//							queryParams: {
//								cateId: cateId
//							}
//						}).datagrid('reload');
//						alert(cateId);
//					}
//				    });
// 					bstop = true;
// 				}
//			});
// 				
//			/*添加分类*/
//			var cateId = null;
//  		$('#addBtn').click(function(){
//  			$('#ff').form('clear');
//  			if(cateId === null){
//  				$.messager.show({
//	                title:'信息提示',
//	                msg:'请选择分类，否则无法添加分类',
//	                timeout:3000,
//	                showType:'show'
//	            });
//  			}else{
//  				//$('#dlg').dialog('open');//添加新闻的提示框弹出
//  				
//  			}
//  		});
    		
    		var cateId = null;
    		num=1;
    		$('#tt').tree({
			    url: "http://localhost:3000/cate/list/"+num,
			    method:'get',
			    onClick: function(node){
					cateId = node._id;					
				}
			});
			
			$('#loadAllDataBtn').click(function(){
				num++;
				if(num>2){
					num=1;
				}
				$('#tt').tree({
			    url: "http://localhost:3000/cate/list/"+num,
			    method:'get',
			    onClick: function(node){
					cateId = node._id;
				}
			});
			})
			
			
			
			$("#addBtn").click(function(){
	    			$('#ff').form('clear');
	    			if(cateId === null){
	    				$.messager.show({
		                title:'信息提示',
		                msg:'请选择分类，否则无法添加分类',
		                timeout:3000,
		                showType:'show'
		            });
	    			}else{
	    				$('#dlg').dialog('open');
	    			}
	    		})
//	    		
//	    			
//	    			
    		function submitForm(){
				var postData = $("#ff").serializeJSON();
				
	    			postData.parentId = cateId;
	    			postData.type=num;
	    				delete postData._id;
	    				$.ajax({
		    				type:"post",
		    				url:"http://localhost:3000/cate/data",
		    				data: postData,
		    				async:true,
		    				name:"txt"
		    			}).done(function(res){
		    				// 这里要做一件事
		    				$.messager.show({
			                title:'信息提示',
			                msg:'数据添加成功',
			                timeout:3000,
			                showType:'show'
			            });
			            $('#dlg').dialog('close');
			            $('#tt').tree('reload');
		    			})
	
	        	}
    		
    		
    		$('#removesBtn').click(function(){
					deleteData(cateId);
				})
				
	    		function deleteData(id){
	    			
	    			$.messager.confirm('确认删除', '你确认删除数据吗？', function(r){
	                if (r){
			    			$.ajax({
			    				type:"delete",
			    				url:"http://localhost:3000/cate/data/" + id,
			    				async:true
			    			}).done(function(res){
			    				$("#tt").tree('reload');
			    			})
	                }
	            });
	    		}
    </script>
	</body>
	</html> 